$(function () {

    cateInit()
    dateInit()

    richTextInit()

    // 1. 获取分类列表供用户选择
    function cateInit() {
        $.ajax({
            url: bignews.category_list,
            success(res) {
                console.log(res.data);
                const htmlStr = template('cateTemp', res)
                $('#cateList').html(htmlStr)
            }
        })
    }

    cateInit()


    function dateInit() {
        jeDate('#articleDate', {
            trigger: 'click',
            theme: { bgcolor: "#ff0000", pnColor: "#00DDAA" },//绿色主题
            format: "YYYY-MM-DD", // 年月日
            isinitVal: true
        })
    }

    function richTextInit() {
        // 初始化富文本框--richTextBox
        tinymce.init({
            selector: '#articleContent',
            height: '350px', // 高度
            language: 'zh_CN', // 语言，如果没有设置则默认为英文
            directionality: 'ltl', // 对齐方向
            browser_spellcheck: true, // 是否启用拼写检查
            contextmenu: false, // 右键菜单
            plugins: [ // 插件
                "advlist autolink lists link image charmap print preview anchor",
                "searchreplace visualblocks code fullscreen",
                "insertdatetime media table contextmenu paste imagetools wordcount",
                "code"
            ],
            // 下面是工具条
            toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | code",
        });
    }


    // 2. 监听图片选择事件, 预览图片
    $('#inputCover').on('change', function () {
        // 1. 获取选择图片
        let myFile = $('#inputCover')[0].files[0]
        // 2. 将图片转换为可显示的地址
        let url = URL.createObjectURL(myFile)
        // 3. 替换原来的img src
        $('.article_cover').attr('src', url)
    })

    $('.btn-release').on('click', function () {
        submitPost('已发布')
    })

    $('.btn-draft').on('click', function () {
        submitPost('草稿')
    })
    // console.log(1111111);
    // console.log($('#articleDate').val());
    // 没有办法直接获取富文本框字段
    // 只能调用富文本插件的方法
    // console.log( $('#articleContent').val());
    // console.log(tinymce.activeEditor.getContent());
    // console.log( tinymce.activeEditor.getContent());
    // 这里是发布按钮被点击
    // 由于发布文章里面带有图片,
    // 不能使用字符串带参方式, 需要使用 formData 方式转换为字符串
    function submitPost(state) {

        let data = new FormData($('#form')[0])
        // 我们知道这个富文本框数据需要另外获取
        data.append('content', tinymce.activeEditor.getContent());
        // data.append('state', '已发布')
        data.append('state', state)

        // 这里是发布按钮被点击)
        $.ajax({
            type: 'post',
            url: bignews.article_publish,
            data,
            contentType: false,
            processData: false,
            success(res) {
                console.log(res);
                if (res.code == 200) {
                    location = './article_list.html'
                }
            }
        })
    }
})
